/** @type {import('tailwindcss').Config} */
export default {
  content: ["./index.html", "./src/*.vue", "./src/**/*.vue"],
  theme: {
    extend: {
      flex: {
        3: "3 1 0% !important",
        2: "2 1 0% !important",
        1: "1 1 0% !important",
      },
      colors: {
        blue: "#7DD0FF", // 大部分的蓝色字体
        lightgray: "#F5F7F6",
        "tab-gray": "#EEEFF0",
        "main-green": "#007260",
        "main-red": "#F75855",
        "main-gray": "#F5F7FA",
        "main-black": "#333333",
        "gray-light": "#EEEEEE",
        "gray-999": "#999999",
        "black-222": "#222222",
      },
      backgroundImage: {
        "line-gradient":
          "linear-gradient(50deg, rgba(21,154,255,0.57) 0%, #159AFF 100%)",
        "abnormal-gradient":
          "linear-gradient( 50deg, rgba(233,44,44,0.57) 0%, #E92C2C 100%)",
        "off-gradient":
          "linear-gradient( 50deg, rgba(201,201,201,0.57) 0%, #797979 100%)",
        "btnActive-gradient":
          "linear-gradient( 136deg, #3080F0 0%, #3080F0 19%, #18BEF4 100% )",
      },
      backdropBlur: {
        default: "10px",
        40: "40px",
        10: "10px",
      },
    },
    screens: {
      sm: "640px",
      // => @media (min-width: 640px) { ... }

      md: "768px",
      // => @media (min-width: 768px) { ... }

      lg: "1024px",
      // => @media (min-width: 1024px) { ... }

      xl: "1280px",
      // => @media (min-width: 1280px) { ... }

      "2xl": "1536px",
      // => @media (min-width: 1536px) { ... }

      "3xl": "1750px",
      // => @media (min-width: 1750px) { ... }
    },
    zIndex: {
      9: "9",
      0: "0",
      1: "1",
    },
  },
  plugins: [],
};
